<template>
	<div class="dialog-container">
		<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" :close-on-click-modal="false" width="1000px" @close="onCancel">
			<OrderAfterRecords ref="orderAfterRecordsRef" />
		</el-dialog>
	</div>
</template>

<script lang="ts" setup>
import { defineAsyncComponent, reactive, ref } from 'vue';
import { storeToRefs } from 'pinia';
import { supplierWithdrawalApi } from '/@/api/supplier';
import { supplierWithdrawalApi as supplierWithdrawalApi1 } from '/@/api';
import { useUserInfo } from '/@/stores/userInfo';

const OrderAfterRecords = defineAsyncComponent(() => import('../orderAfterRecords.vue'));

const storesUserInfo = useUserInfo();
const { userInfos } = storeToRefs(storesUserInfo);
const SupplierWithdrawalApi = supplierWithdrawalApi();
const SupplierWithdrawalApi1 = supplierWithdrawalApi1();
const state = reactive({
	dialog: {
		isShowDialog: false,
		type: '',
		title: '',
		submitLoading: false,
	},
});
const orderAfterRecordsRef = ref();

/********** 触发事件 **********/
// 取消
const onCancel = () => {
	orderAfterRecordsRef.value.onCancel();
	state.dialog.isShowDialog = false;
};

/********** 方法事件 **********/
// 打开
const openDialog = (row: any) => {
	state.dialog.isShowDialog = true;
	state.dialog.title = `「${row.order_detail_no}」售后记录`;
	_orderAfterInfo({ order_detail_id: row.order_detail_id });
};

/********** 网络请求 **********/
// 售后详情信息
const _orderAfterInfo = (params: Object) => {
	let Api: any = SupplierWithdrawalApi;
	if (userInfos.value.supplier_id) {
		Api = SupplierWithdrawalApi;
	} else {
		Api = SupplierWithdrawalApi1;
	}
	Api.orderAfterInfo(params).then((res: any) => {
		setTimeout(() => {
			orderAfterRecordsRef.value.openDialog(res.data.info.item);
		}, 1000);
	});
};

/********** 方法向父组件暴露 **********/
defineExpose({ openDialog });
</script>
